<template>
  <div style="margin-top:20px">
    <!-- ----------------------------------modbus------------------------------------------->
    <el-table ref="multipleTable" height="250" border :data="rule_map" size='mini'>
      <template slot="empty">
        <el-empty :description="$t('暂无数据')"></el-empty>
      </template>
      <el-table-column prop="rule_id" align='center' :label="$t('规则ID')" width="80" />
      <el-table-column prop="operate_type" align='center' width="120" :label="$t('类型')">
        <template slot-scope="scope">
          {{ $t(operateTypeList[scope.row.operate_type]) }}
        </template>
      </el-table-column>
      <el-table-column prop="proto" align='center' width="120" :label="$t('协议名称')" />
      <el-table-column prop="action" align='center' width="80" :label="$t('动作')">
        <template slot-scope="scope">
          {{ $t(actionList[scope.row.operate_type][scope.row.action]) }}
        </template>
      </el-table-column>
      <el-table-column prop="func" align='center' :formatter="funcFormatter" width="140" :label="$t('功能码')" />
      <el-table-column prop="device_address" align='center' :formatter="deviceAddressFormatter" width="140" :label="$t('设备地址')" />
      <el-table-column prop="read_register_address_range" align='center' :formatter="readRegisterAddressRangeFormatter" width="140" :label="$t('读寄存器地址范围')" />
      <el-table-column prop="write_register_address_range" align='center' :formatter="writeRegisterAddressRangeFormatter" width="140" :label="$t('写寄存器地址范围')" />
      <el-table-column prop="file_num" align='center' width="140" :formatter="fileNumFormatter" :label="$t('文件编号')" />
      <el-table-column prop="error_count" align='center' width="140" :label="$t('错误次数')" />
      <el-table-column prop="register_value_range" align='center' :formatter="registerValueRangeFormatter" width="140" :label="$t('寄存器值范围')" />
      <el-table-column prop="accept_range" align='center' width="100" :label="$t('匹配范围')">
        <template slot-scope="scope">
          {{ $t(acceptRangeList[scope.row.accept_range]) }}
        </template>
      </el-table-column>
      <el-table-column align="center" :label="$t('操作')" width="160" fixed='right'>
        <template slot-scope="scope">
          <el-button type="success" plain @click="editRule(scope.row)" size='mini'>{{$t('编辑')}}</el-button>
          <el-button type="danger" plain @click="deleteRule(scope.row)" size='mini'>{{$t('删除')}}</el-button>
        </template>
      </el-table-column>
    </el-table>

    <!-- ----------------------------------modbus_connect------------------------------------------->
    <el-table ref="multipleTable" height="250" border :data="rule_map_connect" style="margin-top:20px;" size='mini'>
      <template slot="empty">
        <el-empty :description="$t('暂无数据')"></el-empty>
      </template>
      <el-table-column prop="rule_id" align='center' :label="$t('规则ID')" width="80" />
      <el-table-column prop="operate_type" align='center' :formatter="protoValue" width="120" :label="$t('类型')">
        <template slot-scope="scope">
          {{ $t(operateTypeList[scope.row.operate_type]) }}
        </template>
      </el-table-column>
      <el-table-column prop="proto" align='center' width="120" :label="$t('协议名称')" />
      <el-table-column prop="action" align='center' width="80" :label="$t('动作')">
        <template slot-scope="scope">
          {{ $t(actionList[scope.row.operate_type][scope.row.action]) }}
        </template>
      </el-table-column>
      <el-table-column prop="write_reg_func" align='center' width="140" :label="$t('写操作功能码')">
        <template slot-scope="scope">
          {{ $t(writeRegFuncList[scope.row.write_reg_func]) }}
        </template>
      </el-table-column>
      <el-table-column prop="write_device_address" align='center' width="140" :label="$t('写操作设备编号')" />
      <el-table-column prop="write_addr" align='center' width="140" :label="$t('写寄存器地址')" />
      <el-table-column prop="connect_read_reg_func" align='center' width="140" :label="$t('读功能码')">
        <template slot-scope="scope">
          {{ $t(connectReadRegFuncList[scope.row.connect_read_reg_func]) }}
        </template>
      </el-table-column>
      <el-table-column prop="connect_read_device_address" align='center' width="140" :label="$t('读设备编号')" />
      <el-table-column prop="connect_read_addr" align='center' width="140" :label="$t('读寄存器地址')" />
      <el-table-column prop="connect_read_value_min" align='center' width="160" :label="$t('读设备安全范围最小值')" />
      <el-table-column prop="connect_read_value_max" align='center' width="160" :formatter="connectReadValueMaxFormatter" :label="$t('读设备安全范围最大值')" />
      <el-table-column align="center" :label="$t('操作')" width="160" fixed='right'>
        <template slot-scope="scope">
          <el-button type="success" plain @click="editRule(scope.row)" size='mini' :class="'edit' +(scope.$index+1)">{{$t('编辑')}}</el-button>
          <el-button type="danger" plain @click="deleteRule(scope.row)" size='mini' :class="'del' +(scope.$index+1)">{{$t('删除')}}</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import ruleArray from '../../ruleArray'
export default {
  name: 'ModbusTable',
  props: {
    ruleMap: {
      type: Array,
      default () {
        return []
      }
    }
  },
  watch: {
    ruleMap: {
      handler (newValue, oldValue) {
        this.rule_map = []
        this.rule_map_connect = []
        newValue.forEach(val => {
          if (val.proto === 'modbus') {
            this.rule_map.push(val)
          } else if (val.proto === 'modbus_connect') {
            this.rule_map_connect.push(val)
          }
        })
      },
      deep: true // 深度监听
    }
  },
  data () {
    return {
      dialogVisible: false,
      ruleDialogVisible: false,
      rule_map: [],
      rule_map_connect: [],
      funcList: ruleArray.funcList,
      rangeList: ruleArray.rangeList,
      operateTypeList: { '0': '深度过滤', '1': '扫描防护', '2': '关联操作' },
      connectReadValueMaxList: ['1', '2'],
      registerValueList: ['5', '15'],
      registerValueRangeList: ['6', '16', '23'],
      connectReadValueSelectList: {
        '0': '关',
        '1': '开'
      },
      registerValueRangeSelectList: {
        '0': '关',
        '1': '开',
        '2': '开关'
      },
      actionList: {
        '0': { 'accept': '允许', 'alert': '告警' },
        '1': { 'alert': '告警', 'deny': '阻断' },
        // '1': { 'alert': '告警' },
        '2': { 'accept': '允许', 'alert': '告警' }
      },
      writeRegFuncList: {
        '5': '写线圈',
        '6': '写寄存器'
      },
      connectReadRegFuncList: {
        '1': '读线圈',
        '2': '读输入离散量',
        '3': '读取保持寄存器',
        '4': '读输入寄存器'
      },
      acceptRangeList: {
        'all': '所有',
        'single': '单个'
      }
    }
  },
  mounted () {
    this.rule_map = []
    this.ruleMap.forEach(val => {
      if (val.proto === 'modbus') {
        this.rule_map.push(val)
      } else if (val.proto === 'modbus_connect') {
        this.rule_map_connect.push(val)
      }
    })
  },
  methods: {
    deleteRule (row) {
      this.$emit('delRuleMap', row)
    },
    editRule (row) {
      this.$emit('largeConfig', row)
    },
    protoValue (data) {
      return this.rule[data.proto]
    },
    funcFormatter (data) {
      if (data.operate_type === '1') {
        return
      }
      return data.operate_type === '0' ? (this.$t(this.funcList[data.func]) || data.func) : ''
    },
    deviceAddressFormatter (data) {
      if (data.operate_type === '1') {
        return
      }
      return data.device_address
    },
    readRegisterAddressRangeFormatter (data) {
      if (data.operate_type === '1') {
        return '0-0'
      }
      if (data.reg_addr_read_start) {
        return data.reg_addr_read_start + '-' + data.reg_addr_read_end
      }
    },
    writeRegisterAddressRangeFormatter (data) {
      if (data.operate_type === '1') {
        return '0-0'
      }
      if (data.reg_addr_write_start) {
        return data.reg_addr_write_start + '-' + data.reg_addr_write_end
      }
    },
    registerValueRangeFormatter (data) {
      if (this.registerValueRangeList.includes(data.func)) {
        return data.register_value_range
      } else if (this.registerValueList.includes(data.func)) {
        return this.$t(this.registerValueRangeSelectList[data.register_value_range.split('-')[0]])
      }
    },
    fileNumFormatter (data) {
      if (data.operate_type === '1') {
        return
      }
      return data.file_num
    },
    connectReadValueMaxFormatter (data) {
      if (this.connectReadValueMaxList.includes(data.connect_read_reg_func)) {
        return this.$t(this.connectReadValueSelectList[data.connect_read_value_max])
      }
      return data.connect_read_value_max
    }
  }
}
</script>
